<template>


	<view>
		
	<view class="">
			<u-form :model="form" ref="uForm">
				<u-form-item label="邮箱" prop="email">
					<u-input v-model="form.email" />
				</u-form-item>
				
				
				<u-toast ref="uToast"></u-toast>
				<view class="u-demo-block">
					<text class="u-demo-block__title"></text>
					<view class="u-demo-block__content">
						<u-row customStyle="margin-bottom: 10px">
							<u-col span="8">
								<view class="demo-layout bg-purple-light">
									<u-form-item label="验证码" prop="Code">
										<u-input v-model="mail.Code" />
									</u-form-item>
								</view>
							</u-col>
							<u-col span="4">
								<view class="demo-layout bg-purple">
									<u-button @click="verification_code" type="success">获取验证码</u-button>
								</view>
							</u-col>
						</u-row>
						<u-row customStyle="margin-bottom: 10px">
							<u-col span="4">
								<view class="demo-layout bg-purple"></view>
							</u-col>
							<u-col span="4">
								<view class="demo-layout bg-purple-light"></view>
							</u-col>
							<u-col span="4">
								<view class="demo-layout bg-purple-dark"></view>
							</u-col>
						</u-row>
						<u-button @click="submit" type="primary">登录</u-button>
					
					</view>
				</view>
		
			</u-form>

		
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			form: {
				email: '',
				content:'',
				subject:'',
				
			},
			
			mail:{
				
				Code:''
			},
			
			
			show: false,
			list1:{
					type: 'error',
					icon: false,
					title: '失败主题',
					message: "账号密码错误！",
					iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/error.png'
					},
			rules: {
				phone: [
					{ 
						required: true, 
						message: '请输入邮箱', 
						// 可以单个或者同时写两个触发验证方式 
						trigger: ['change','blur'],
					}
				],
				password: [
					{
						min: 5, 
						message: '密码不能少于6个', 
						trigger: 'change'
					}
				]
			}
		};
	},
	methods: {
		submit() {
			const EmailCode = {
				email:this.form.email,code:this.mail.Code
			} 
			console.log(EmailCode);
			this.$api({
				method: 'post',
				url: '/system/login/userEmailLogin',
				data: EmailCode
			}).then(res => {
				console.log(res);
				uni.reLaunch({
					url:"/pages/home/home"
				})

			}).catch(err => {
				console.log(err)
			});
		},
		verification_code(){
			this.$api({
				method: 'post',
				url: '/system/login/sendEmail',
				 data: this.form
			}).then(res => {
				// console.log(res);
				// if (res.data != null) {
				// 	// 存入本次缓存中
					
				// 	console.log(res.data);
				// 	uni.reLaunch({
				// 		url:"/pages/home/home"
				// 	})
				// 	uni.setStorageSync('userInfo_id', res.data.id);
				// 	// this.$u.toast('登录成功');
				// 	// uni.navigateBack();
				// } else {
				// 	this.showToast(this.list1),
				// 	console.log("失败");
				// }
			}).catch(err => {
				console.log(err)
			});
		},
		showToast(params) {
			console.log(params);
			this.$refs.uToast.show({
				...params,
				complete() {
					params.url && uni.navigateTo({
						url: params.url
					})
				}
			})
		},
		
		register(){
			uni.navigateTo({
				url:"/pages/index/register/register"
			})
		}
	},
	// 必须要在onReady生命周期，因为onLoad生命周期组件可能尚未创建完毕
	onReady() {
		this.$refs.uForm.setRules(this.rules);
	}
};
</script>
<style>
/* 	.wrap {
	    padding: 12px;
	}
	
	.demo-layout {
	    height: 25px;
	    border-radius: 4px;
	}
	
	.bg-purple {
	    background: #ced7e1;
	}
	
	.bg-purple-light {
	    background: #e5e9f2;
	}
	
	.bg-purple-dark {
	    background: #99a9bf;
	} */
</style>
